import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:sinosheets/r.dart';
import 'package:sinosheets/route/route_utils.dart';
import 'package:url_launcher/url_launcher.dart';
import 'logic.dart';

class AboutUsPage extends StatefulWidget {
  const AboutUsPage({Key? key}) : super(key: key);

  @override
  State<AboutUsPage> createState() => _AboutUsPageState();
}

class _AboutUsPageState extends State<AboutUsPage> {
  final AboutUsLogic logic = Get.put(AboutUsLogic());

  @override
  Widget build(BuildContext context) {
    final double iconSize = 100.r;
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle.dark,
      child: Scaffold(
        extendBodyBehindAppBar: true,
        appBar: AppBar(
          backgroundColor: Colors.transparent,
          elevation: 0,
          leading: IconButton(
            icon: Icon(Icons.arrow_back_ios_new_rounded, color: Colors.black, size: 24.r),
            onPressed: () => Navigator.of(context).pop(),
          ),
          centerTitle: true,
          title: Text('About Us', style: TextStyle(color: Colors.black, fontWeight: FontWeight.bold, fontSize: 20.sp)),
        ),
        body: Container(
          width: double.infinity,
          height: double.infinity,
          decoration: const BoxDecoration(
            gradient: LinearGradient(
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter,
              colors: [Color(0xFFFFE5E0), Colors.white],
            ),
          ),
          child: SingleChildScrollView(
            child: Column(
              children: [
                SizedBox(height: 120.r),
                Container(
                  clipBehavior: Clip.hardEdge,
                  width: iconSize,
                  height: iconSize,
                  decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(24.r),
                    boxShadow: [
                      BoxShadow(
                        color: Colors.black12,
                        blurRadius: 16.r,
                        offset: Offset(0, 4.r),
                      ),
                    ],
                  ),
                  child: Center(
                    child: Image.asset(
                      R.assetsImgPlaystoreIcon,
                      width: 100.r,
                      height: 100.r,
                    ),
                  ),
                ),
                SizedBox(height: 24.r),
                Text(
                  'Sinosheets',
                  style: TextStyle(
                    fontSize: 28.sp,
                    fontWeight: FontWeight.bold,
                    color: Colors.black,
                  ),
                ),
                SizedBox(height: 12.r),
                Container(
                  padding: EdgeInsets.symmetric(horizontal: 18.r, vertical: 6.r),
                  decoration: BoxDecoration(
                    color: Color(0xFFFFE5E0),
                    borderRadius: BorderRadius.circular(18.r),
                  ),
                  child: Text(
                    'Version ${logic.version}',
                    style: TextStyle(
                      color: Color(0xFFFF5A36),
                      fontWeight: FontWeight.w500,
                      fontSize: 16.sp,
                    ),
                  ),
                ),
                SizedBox(height: 32.r),
                // _buildCard(
                //   context,
                //   icon: Icons.support_agent_rounded,
                //   iconColor: Color(0xFFFF5A36),
                //   title: 'Contact Us',
                //   subtitle: 'Get help when you need it',
                //   onTap: () => _showContactDialog(context),
                // ),
                // SizedBox(height: 18.r),
                _buildCard(
                  context,
                  icon: Icons.privacy_tip_rounded,
                  iconColor: Color(0xFFFF5A36),
                  title: 'Privacy Policy',
                  subtitle: 'Learn how we protect your data',
                  onTap: () {
                    RouteUtils.toWebView(url: 'https://sinosheets.com/policy');
                  },
                ),
                SizedBox(height: 18.r),
                _buildCard(
                  context,
                  icon: Icons.description_rounded,
                  iconColor: Color(0xFFFF5A36),
                  title: 'Terms of Service',
                  subtitle: 'Read our terms and conditions',
                  onTap: () {
                    RouteUtils.toWebView(url: 'https://sinosheets.com/agreement');
                  },
                ),
                SizedBox(height: 32.r),
                RichText(
                  text: TextSpan(
                    children: [
                      TextSpan(text: 'Contact Us: ', style: TextStyle(fontSize: 18.sp, fontWeight: FontWeight.bold, color: Colors.black)),
                      //点击事件
                      TextSpan(
                        text: 'customer@sinosheets.com',
                        style: TextStyle(fontSize: 18.sp, fontWeight: FontWeight.bold, color: Color(0xFFFF5A36), decoration: TextDecoration.underline),
                        recognizer: TapGestureRecognizer()
                          ..onTap = () {
                            launchUrl(Uri.parse('mailto:customer@sinosheets.com'));
                          },
                      )
                    ],
                  ),
                ),
                SizedBox(height: 32.r),

                ///点击跳转Discord和Reddit
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    InkWell(
                      onTap: () {
                        launchUrl(Uri.parse('https://discord.com/invite/W7ppQk7yQR'));
                      },
                      child: Icon(Icons.discord, size: 32.r),
                    ),
                    SizedBox(width: 24.r),
                    InkWell(
                      onTap: () {
                        launchUrl(Uri.parse('https://www.reddit.com/r/itaobuyshare'));
                      },
                      child: Icon(Icons.reddit, size: 32.r),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }

  Widget _buildCard(BuildContext context, {required IconData icon, required Color iconColor, required String title, required String subtitle, required VoidCallback onTap}) {
    return Padding(
      padding: EdgeInsets.symmetric(horizontal: 24.r),
      child: Material(
        color: Colors.white,
        borderRadius: BorderRadius.circular(18.r),
        elevation: 0,
        child: InkWell(
          borderRadius: BorderRadius.circular(18.r),
          onTap: onTap,
          child: Container(
            padding: EdgeInsets.symmetric(vertical: 18.r, horizontal: 12.r),
            child: Row(
              children: [
                Container(
                  width: 44.r,
                  height: 44.r,
                  decoration: BoxDecoration(
                    color: Color(0xFFFFE5E0),
                    borderRadius: BorderRadius.circular(12.r),
                  ),
                  child: Icon(icon, color: iconColor, size: 28.r),
                ),
                SizedBox(width: 16.r),
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        title,
                        style: TextStyle(
                          fontSize: 18.sp,
                          fontWeight: FontWeight.bold,
                          color: Colors.black,
                        ),
                      ),
                      SizedBox(height: 4.r),
                      Text(
                        subtitle,
                        style: TextStyle(
                          fontSize: 14.sp,
                          color: Colors.grey,
                        ),
                      ),
                    ],
                  ),
                ),
                Icon(Icons.arrow_forward_ios_rounded, color: Colors.grey, size: 18.r),
              ],
            ),
          ),
        ),
      ),
    );
  }

  // void _showContactDialog(BuildContext context) {
  //   showDialog(
  //     context: context,
  //     builder: (context) {
  //       return Dialog(
  //         shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20.r)),
  //         child: Padding(
  //           padding: EdgeInsets.symmetric(horizontal: 24.r, vertical: 28.r),
  //           child: Column(
  //             mainAxisSize: MainAxisSize.min,
  //             crossAxisAlignment: CrossAxisAlignment.start,
  //             children: [
  //               Center(
  //                 child: Text(
  //                   'Contact Us',
  //                   style: TextStyle(
  //                     fontSize: 22.sp,
  //                     fontWeight: FontWeight.bold,
  //                     color: Colors.black,
  //                   ),
  //                 ),
  //               ),
  //               SizedBox(height: 18.r),
  //               _buildContactRow('Discord:', 'https://discord.com/invite/W7ppQk7yQR'),
  //               SizedBox(height: 10.r),
  //               _buildContactRow('Reddit:', 'https://www.reddit.com/r/itaobuyshare'),
  //               SizedBox(height: 10.r),
  //               _buildContactRow('Email:', 'customer@sinosheets.com'),
  //             ],
  //           ),
  //         ),
  //       );
  //     },
  //   );
  // }

  // Widget _buildContactRow(String label, String value) {
  //   // final bool isLink = value.startsWith('http') || value.contains('@') || value.startsWith('+');
  //   return RichText(
  //     text: TextSpan(
  //       children: [
  //         TextSpan(
  //           text: label + ' ',
  //           style: TextStyle(fontWeight: FontWeight.bold, color: Colors.black, fontSize: 16.sp),
  //         ),
  //         TextSpan(
  //           text: value,
  //           style: TextStyle(color: Color(0xFFFF5A36), fontSize: 16.sp),
  //         ),
  //       ],
  //     ),
  //   );
  // }

  @override
  void dispose() {
    Get.delete<AboutUsLogic>();
    super.dispose();
  }
}
